<template>
  <el-table :data="detail" border style="width: 100%">
    <el-table-column label="编号" type="index" width="60" />

    <el-table-column
      v-for="item in columns"
      :key="item.dataIndex"
      :label="item.title"
      :prop="item.dataIndex"
      show-overflow-tooltip
    />
  </el-table>
</template>

<script setup lang="ts">
const props = defineProps({
  detail: Array
})
const columns = ref(
  Object.freeze([
    { title: '登记号', dataIndex: 'registrationNo' },
    { title: '作品类别', dataIndex: 'type' },
    { title: '作品名称', dataIndex: 'name' },
    { title: '创作完成日期', dataIndex: 'completionDate' },
    { title: '首次发表日期', dataIndex: 'publicationDate' },
    { title: '登记日期', dataIndex: 'registrationDate' }
  ])
)
</script>
